import React, { Component,PropTypes } from 'react'
import { hashHistory } from 'react-router'
import { NavBar,Button } from 'antd-mobile'
import CSSModules from 'react-css-modules'
//postcss prefixauto 什么的
import { connect } from 'react-redux'
import Footer from '../../components/Footer.js'

import styles from './index.less';
@CSSModules(styles, { allowMultiple: false })
class App extends Component{
	static propTypes = {
	    navobj: PropTypes.object.isRequired
	}
	// componentDidMount(){
	// 	this.props.tochangeNav({title:"快捷登陆12",rbtn:[
	//         <Button type="primary" inline size="small">确定</Button>
	//     ]})
	// }{ background:"none",color:"black" }
	// <Footer crtroute={ this.props.crtroute }></Footer>

	

	render(){
		const { children } = this.props
		return(
			<div>
				<div styleName="navbar">
					<NavBar style={ this.props.navobj.navstyle ? this.props.navobj.navstyle : {} } styleName="navbarin" mode="dark"
			          onLeftClick={() => hashHistory.goBack()}
			          rightContent={ this.props.navobj.rbtn }
			        >
						{ this.props.navobj.title }
					</NavBar>
			    </div>
				<div styleName="mainCan">
					{children}
				</div>
				
			</div>
		)
	}
}

const mapStateToProps = (state,ownProps) => {

  return{
  	navobj: state.changeNav,
  	crtroute: ownProps.location
  }

}

// const mapDispatchToProps = (dispatch) => {
//   return{
//     tochangeNav:navobj => dispatch( changeNav( navobj ) )
//   }
// }

export default connect(mapStateToProps)(App)